<template>
  <view class="settle">
    <view class="settle__tip">修改类型选择</view>
    <u-cell-group>
      <u-cell-item
        title="收益配置"
        :arrow="true"
        value="查看详情"
        @click="goEarningDetail"
      >
      </u-cell-item>
      <u-cell-item title="交易分润代付开关" :arrow="false">
        <!--   active-color="#2979ff" inactive-color="#ffffff" :active-value="'1'" :inactive-value="'0'" -->
        <u-switch
          slot="right-icon"
          v-model="cashbackSwitch"
          active-value="1"
          inactive-value="0"
          @change="asyncChange"
        ></u-switch>
      </u-cell-item>
      <u-cell-item title="笔数分润代付开关" :arrow="false">
        <u-switch
          slot="right-icon"
          v-model="profitSwitch"
          active-value="1"
          inactive-value="0"
          @change="asyncChange2"
        ></u-switch>
      </u-cell-item>
      <u-cell-item
        title="返现配置"
        :arrow="true"
        value="查看详情"
        @click="goReturnDetail"
      >
      </u-cell-item>
      <u-cell-item title="返现分润代付开关" :arrow="false">
        <u-switch
          slot="right-icon"
          v-model="settleProfitSwitch"
          active-value="1"
          inactive-value="0"
          @change="asyncChange3"
        ></u-switch>
      </u-cell-item>
    </u-cell-group>
  </view>
</template>

<script>
export default {
  data() {
    return {
      customStyle: {
        // 注意驼峰命名，并且值必须用引号包括，因为这是对象
        backgroundColor: '#9D60FF',
      },
      cashbackSwitch: true, // 操作返现开关
      profitSwitch: true, // 操作分润代付开关
      settleProfitSwitch: true, // 操作结算分润代付开关
      agentNo: '',
    };
  },
  onLoad(options) {
    console.log('options----->54', options);
    // 赋值代理商编号
    this.agentNo = options.agentNo;
    // 获取详情接口数据
    this.getAgentDetailList();
  },
  mounted() {},
  methods: {
    // 获取详情接口数据
    getAgentDetailList() {
      this.$zx.user_api.getAgentDetail(this.agentNo).then((data) => {
        console.log('getAgentDetail----->65', data.agentInfoDo);
        this.cashbackSwitch =
          data.agentInfoDo.cashbackSwitch == '1' ? true : false; //政策成本
        this.profitSwitch = data.agentInfoDo.profitSwitch == '1' ? true : false; //政策成本
        this.settleProfitSwitch =
          data.agentInfoDo.settleProfitSwitch == '1' ? true : false; //政策成本
      });
    },
    // 收益配置查看详情
    goEarningDetail() {
      this.$u.route({
        url: 'pages/main/agent/agentCostAllocationDetail',
        params: {
          agentNo: this.agentNo, // 传递代理商编号
        },
      });
    },
    // 返现配置查看详情
    goReturnDetail() {
      this.$u.route({
        url: 'pages/main/agent/agentAddReappearanceAllocationMoney',
        params: {
          agentNo: this.agentNo, // 传递代理商编号
        },
      });
    },
    // 监听开关事件
    asyncChange(e) {
      console.log('asyncChange----->', e);
      // 操作返现开关
      this.$zx.common_api
        .editCashbackSwitch(this.agentNo, this.cashbackSwitch ? '1' : '0')
        .then((data) => {
          console.log('editCashbackSwitch----->', data);
          this.getAgentDetailList();
        });
    },
    // 监听开关事件
    asyncChange2(e) {
      console.log('asyncChange2----->', e);
      // 操作分润代付开关
      this.$zx.common_api
        .editProfitSwitch(this.agentNo, this.profitSwitch ? '1' : '0')
        .then((data) => {
          console.log('editProfitSwitch----->', data);
          this.getAgentDetailList();
        });
    },
    // 监听开关事件
    asyncChange3(e) {
      console.log('asyncChange3----->', e);
      // 操作结算分润代付开关
      this.$zx.common_api
        .editSettleProfitSwitch(
          this.agentNo,
          this.settleProfitSwitch ? '1' : '0'
        )
        .then((data) => {
          console.log('editSettleProfitSwitch----->', data);
          this.getAgentDetailList();
        });
    },
  },
};
</script>

<style scoped lang="scss">
.settle {
  &__top {
    width: 100%;
  }
  .settle__tip {
    background-color: #f6f6f6;
    padding: 30rpx 20rpx;
    font-size: 32rpx;
  }
  &__form {
    background-color: white;
  }
  &__upload {
    background-color: white;
    padding: 20rpx;
  }
  .u-cell-box {
    background: white;
  }
}
.tip {
  text-align: center;
}
.slot-content {
  padding: 20rpx;
  font-size: 14px;
}
</style>
